<div class="panel panel-default panel-intro">
    {:build_heading()}

    <div class="panel-body">
        <a href="javascript:;" class="btn btn-success btn-add" title="{:__('Add')}" onclick="addGroup()"><i class="fa fa-plus"></i> {:__('添加组')}</a>
        <div id="myTabContent" class="tab-content">
            <div class="tab-pane fade active in" id="one">
                <div class="widget-body no-padding">
                    <table id="table" class="table table-striped table-bordered table-hover table-nowrap"
                           data-operate-edit="{:$auth->check('general/group/edit')}" 
                           data-operate-del="{:$auth->check('general/group/del')}" 
                           width="100%">
                        <tr><td>ID</td><td>名称</td><td>操作</td></tr>
                        {foreach name="list" item = "val"}
                        <tr>
                            <td>{$val.id}</td>
                        <td>{if condition="$val['pid'] neq 0"} &nbsp;&nbsp;&nbsp;├──{$val['group_name']} {else /}{$val['group_name']} {/if}</td>
                            <td><a href="#" onclick="edit('{$val.id}','{$val.pid}','{$val.group_name}')">编辑</a> |
                            <a href="#" onclick="del('{$val.id}')">删除</a></td>
                        {/foreach}
                        </tr>
                    </table>
                </div>
            </div>

        </div>
    </div>
</div>

<script>
    function addGroup(){
        var group_list = Config.list_group;
        var html = '';
        for(var i=0;i<group_list.length;i++){
            html += "<option value="+group_list[i].id+">"+group_list[i].group_name+"</option>"
        }
        layer.open({
            type: 0,
            title:'请输入名称',
            content: "<div style='display:flex;justify-content:center;'>" +
                "<div><select id='pid' name='pid'><option value='0'>请选择分类</option>" +
                    html +
                "</select></div>" +
                "<textarea id='area' style='width:100%;height:65px;margin-left:20px;'></textarea></div>",
            btn:['保存','取消'],
            yes:function (index,layero) {
                //获取输入框里面的值
                var closeContent = top.$("#area").val() || $("#area").val();
                var sel_pid = top.$("#pid").val() || $("#pid").val();
                if(!closeContent){
                    layer.msg("请输入名称");
                    return false;
                }
                $.post("general/staff/addGroup",{"name":closeContent,'pid':sel_pid},function(){
                    window.location.reload()
                })
                layer.close(index);
                // 在这里提交数据
            },
            no:function (index,layero) {
                layer.close(index);
            }
        });

    }

    function edit(id,pid,names){
        var group_list = Config.list_group;
        var html = '';

        for(var i=0;i<group_list.length;i++){
            var select = '';
            if(id == group_list[i].id){
                select = "selected";
            }else if(pid == group_list[i].id){
                select = "selected";
            }
            html += "<option value="+group_list[i].id+ " "+select+" >"+group_list[i].group_name+"</option>"
        }
        layer.open({
            type: 0,
            title:'请输入名称',
            content: "<div style='display:flex;justify-content:center;'>" +
                "<div><select id='pid' name='pid'><option value='0'>请选择分类</option>" +
                html +
                "</select></div>" +
                "<textarea id='area' style='width:100%;height:65px;margin-left:20px;'>"+names+"</textarea></div>",
            btn:['保存','取消'],
            yes:function (index,layero) {
                //获取输入框里面的值
                var closeContent = top.$("#area").val() || $("#area").val();
                var sel_pid = top.$("#pid").val() || $("#pid").val();
                if(!closeContent){
                    layer.msg("请输入名称");
                    return false;
                }
                $.post("general/staff/editGroup",{"id":id,"name":closeContent,'pid':sel_pid},function(){
                    window.location.reload()
                })
                layer.close(index);
                // 在这里提交数据
            },
            no:function (index,layero) {
                layer.close(index);
            }
        });
    }

    function del(id) {
        layer.confirm("您确定要删除么？",{btn: ['确定', '取消'],title:"提示"}, function(){
            $.post("general/staff/delGroup",{"id":id},function(){
                window.location.reload()
            })
        });
    }

</script>